<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<title>eConstruct HTML Editor Sample</title>
</head>
<body>
<p><font face="Verdana,Geneva,Arial,Helvetica,sans-serif" size="1" color="#000000">



<form action="mydemosave.cfm" method="post" name="sampleForm" id="sampleForm">


<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">

	<!-- Styles -->
	<link REL="stylesheet" TYPE="text/css" HREF="stylesheet/eConstruct_editor_styles.css">
	<!-- Script Functions and Event Handlers -->
	<script LANGUAGE="JavaScript" SRC="scripts/dhtmled.js">
	</script>
	<noscript>
		<h2>This tool requires a browser supporting Javascript scripting</h2>
	</noscript>
	<script ID="clientEventHandlersJS" LANGUAGE="javascript">
	<!--
	// Constants
	//
	var MENU_SEPARATOR = ""; // Context menu separator
	//
	// Globals
	//
	var docComplete = false;
	var initialDocComplete = false;
	var bTextModedemo=false;
	var pureText=true;
	var QueryStatusToolbarButtonsdemo = new Array();
	var ContextMenudemo = new Array();
	var GeneralContextMenudemo = new Array();
	var TableContextMenudemo = new Array();
	var TablePropertiesContextMenudemo = new Array();
	var ImagePropertiesContextMenudemo = new Array();
	var HyperLinkPropertiesContextMenudemo = new Array();
	var AbsPosContextMenudemo = new Array();
	var HyperlinkContextMenudemo = new Array();
	//
	// Utility functions
	//
	// Constructor for custom object that represents an item on the context menu
	function ContextMenuItem(string, cmdId) {
	  this.string = string;
	  this.cmdId = cmdId;
	}
	// Constructor for custom object that represents a QueryStatus command and 
	// corresponding toolbar element.
	function QueryStatusItem(command, element) {
	  this.command = command;
	  this.element = element;
	}
	//
	// Event handlers
	//
	function initdemo(){
	  // Initialze QueryStatus tables. These tables associate a command id with a corresponding button object.
	  
	    
		var xPos = QueryStatusToolbarButtonsdemo.length;
		QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_FONT, document.body.all["DECMD_FONTdemo"]);
	  	QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_BOLD, document.body.all["DECMD_BOLDdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+2] = new QueryStatusItem(DECMD_ITALIC, document.body.all["DECMD_ITALICdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+3] = new QueryStatusItem(DECMD_UNDERLINE, document.body.all["DECMD_UNDERLINEdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+4] = new QueryStatusItem(DECMD_SETFORECOLOR, document.body.all["DECMD_SETFORECOLORdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+5] = new QueryStatusItem(DECMD_SETBACKCOLOR, document.body.all["DECMD_SETBACKCOLORdemo"]);
		
	  
	    
		var xPos = QueryStatusToolbarButtonsdemo.length;
		QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_CUT, document.body.all["DECMD_CUTdemo"]);
	  	QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_COPY, document.body.all["DECMD_COPYdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+2] = new QueryStatusItem(DECMD_PASTE, document.body.all["DECMD_PASTEdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+3] = new QueryStatusItem(DECMD_UNDO, document.body.all["DECMD_UNDOdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+4] = new QueryStatusItem(DECMD_REDO, document.body.all["DECMD_REDOdemo"]);
		
	  
	  	
		var xPos = QueryStatusToolbarButtonsdemo.length;
		QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_HYPERLINK, document.body.all["DECMD_HYPERLINKdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_IMAGE, document.body.all["DECMD_IMAGEdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+2] = new QueryStatusItem(DECMD_JUSTIFYLEFT, document.body.all["DECMD_JUSTIFYLEFTdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+3] = new QueryStatusItem(DECMD_JUSTIFYCENTER, document.body.all["DECMD_JUSTIFYCENTERdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+4] = new QueryStatusItem(DECMD_JUSTIFYRIGHT, document.body.all["DECMD_JUSTIFYRIGHTdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+5] = new QueryStatusItem(DECMD_INDENT, document.body.all["DECMD_INDENTdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+6] = new QueryStatusItem(DECMD_OUTDENT, document.body.all["DECMD_OUTDENTdemo"]);
		
	  
	    
	    var xPos = QueryStatusToolbarButtonsdemo.length;
	  	QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_ORDERLIST, document.body.all["DECMD_ORDERLISTdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_UNORDERLIST, document.body.all["DECMD_UNORDERLISTdemo"]);
		
	  
	    
		var xPos = QueryStatusToolbarButtonsdemo.length;
		QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_INSERTROW, document.body.all["DECMD_INSERTROWdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_DELETEROWS, document.body.all["DECMD_DELETEROWSdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+2] = new QueryStatusItem(DECMD_INSERTCOL, document.body.all["DECMD_INSERTCOLdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+3] = new QueryStatusItem(DECMD_DELETECOLS, document.body.all["DECMD_DELETECOLSdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+4] = new QueryStatusItem(DECMD_INSERTCELL, document.body.all["DECMD_INSERTCELLdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+5] = new QueryStatusItem(DECMD_DELETECELLS, document.body.all["DECMD_DELETECELLSdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+6] = new QueryStatusItem(DECMD_MERGECELLS, document.body.all["DECMD_MERGECELLSdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+7] = new QueryStatusItem(DECMD_SPLITCELL, document.body.all["DECMD_SPLITCELLdemo"]);
		
	  
	  	
	    var xPos = QueryStatusToolbarButtonsdemo.length;
		QueryStatusToolbarButtonsdemo[xPos] = new QueryStatusItem(DECMD_LOCK_ELEMENT, document.body.all["DECMD_LOCK_ELEMENTdemo"]);
		QueryStatusToolbarButtonsdemo[xPos+1] = new QueryStatusItem(DECMD_MAKE_ABSOLUTE, document.body.all["DECMD_MAKE_ABSOLUTEdemo"]);
		
	  
	 
	  // Initialize the context menu arrays.
	    GeneralContextMenudemo[0] = new ContextMenuItem("Cut", DECMD_CUT);
	    GeneralContextMenudemo[1] = new ContextMenuItem("Copy", DECMD_COPY);
	    GeneralContextMenudemo[2] = new ContextMenuItem("Paste", DECMD_PASTE);
		ImagePropertiesContextMenudemo[0] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    ImagePropertiesContextMenudemo[1] = new ContextMenuItem("Image Properties", DECMD_IMAGEPROPERTIES);
		TablePropertiesContextMenudemo[0] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    TablePropertiesContextMenudemo[1] = new ContextMenuItem("Table Properties", DECMD_TABLEPROPERTIES);
		TableContextMenudemo[0] = new ContextMenuItem(MENU_SEPARATOR, 0);
		TableContextMenudemo[1] = new ContextMenuItem("Insert Table", DECMD_TABLEPROPERTIES);
		TableContextMenudemo[2] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    TableContextMenudemo[3] = new ContextMenuItem("Insert Row", DECMD_INSERTROW);
	    TableContextMenudemo[4] = new ContextMenuItem("Delete Rows", DECMD_DELETEROWS);
	    TableContextMenudemo[5] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    TableContextMenudemo[6] = new ContextMenuItem("Insert Column", DECMD_INSERTCOL);
	    TableContextMenudemo[7] = new ContextMenuItem("Delete Columns", DECMD_DELETECOLS);
	    TableContextMenudemo[8] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    TableContextMenudemo[9] = new ContextMenuItem("Insert Cell", DECMD_INSERTCELL);
	    TableContextMenudemo[10] = new ContextMenuItem("Delete Cells", DECMD_DELETECELLS);
	    TableContextMenudemo[11] = new ContextMenuItem("Merge Cells", DECMD_MERGECELLS);
	    TableContextMenudemo[12] = new ContextMenuItem("Split Cell", DECMD_SPLITCELL);
		AbsPosContextMenudemo[0] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    AbsPosContextMenudemo[1] = new ContextMenuItem("Send To Back", DECMD_SEND_TO_BACK);
	    AbsPosContextMenudemo[2] = new ContextMenuItem("Bring To Front", DECMD_BRING_TO_FRONT);
	    AbsPosContextMenudemo[3] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    AbsPosContextMenudemo[4] = new ContextMenuItem("Send Backward", DECMD_SEND_BACKWARD);
	    AbsPosContextMenudemo[5] = new ContextMenuItem("Bring Forward", DECMD_BRING_FORWARD);
	    AbsPosContextMenudemo[6] = new ContextMenuItem(MENU_SEPARATOR, 0);
	    AbsPosContextMenudemo[7] = new ContextMenuItem("Send Below Text", DECMD_SEND_BELOW_TEXT);
	    AbsPosContextMenudemo[8] = new ContextMenuItem("Bring Above Text", DECMD_BRING_ABOVE_TEXT);

	  //Bring Window into Focus
	  window.focus();
	}	
	
	
	function ShowContextMenudemo(theObject) {
	  var menuStringsdemo = new Array();
	  var menuStatesdemo = new Array();
	  var state;
	  var i
	  var idx = 0;
	
	  // Rebuild the context menu. 
	  ContextMenudemo.length = 0;
	
	  // Always show general menu
	  for (i=0; i<GeneralContextMenudemo.length; i++) {
	    ContextMenudemo[idx++] = GeneralContextMenudemo[i];
	  }
	  
	  var selection = theObject.DOM.selection;
	  var cont = selection.createRange();
      if (selection.type == "Control") {
	  	if (cont.item(0).tagName == "TABLE") {
  		  for (i=0; i<TablePropertiesContextMenudemo.length; i++) {
		     ContextMenudemo[idx++] = TablePropertiesContextMenudemo[i];
		  }
		}
	  }
	
	  var selection = theObject.DOM.selection;
	  var cont = selection.createRange();
      if (selection.type == "Control") {
	  	if (cont.item(0).tagName == "IMG") {
  		  for (i=0; i<ImagePropertiesContextMenudemo.length; i++) {
		     ContextMenudemo[idx++] = ImagePropertiesContextMenudemo[i];
		  }
		}
	  }
	
	  // Is the selection inside a table? Add table menu if so
	  if (theObject.QueryStatus(DECMD_INSERTROW) != DECMDF_DISABLED) {
	    for (i=0; i<TableContextMenudemo.length; i++) {
	      ContextMenudemo[idx++] = TableContextMenudemo[i];
	    }
	  }
	
	  // Is the selection on an absolutely positioned element? Add z-index commands if so
	  if (theObject.QueryStatus(DECMD_LOCK_ELEMENT) != DECMDF_DISABLED) {
	    for (i=0; i<AbsPosContextMenudemo.length; i++) {
	      ContextMenudemo[idx++] = AbsPosContextMenudemo[i];
	    }
	  }
	
	  // Set up the actual arrays that get passed to SetContextMenu
	  for (i=0; i<ContextMenudemo.length; i++) {
	    menuStringsdemo[i] = ContextMenudemo[i].string;
	    if (menuStringsdemo[i] != MENU_SEPARATOR && menuStringsdemo[i].cmdId < 6000) {
	      state = theObject.QueryStatus(ContextMenudemo[i].cmdId);
	    } else {
	      state = DECMDF_ENABLED;
	    }
	    if (state == DECMDF_DISABLED || state == DECMDF_NOTSUPPORTED) {
	      menuStatesdemo[i] = OLE_TRISTATE_GRAY;
	    } else if (state == DECMDF_ENABLED || state == DECMDF_NINCHED) {
	      menuStatesdemo[i] = OLE_TRISTATE_UNCHECKED;
	    } else { // DECMDF_LATCHED
	      menuStatesdemo[i] = OLE_TRISTATE_CHECKED;
	    }
	  }
	  
	  // Set the context menu
	  theObject.SetContextMenu(menuStringsdemo, menuStatesdemo);
	}
	
	function ContextMenuActiondemo(itemIndex, theObject) {
	  if (!isRTextModedemo(theObject)) return;	  
	  if (ContextMenudemo[itemIndex].cmdId == DECMD_TABLEPROPERTIES) {
	    OpenAddTableWindowdemo(theObject);
	  }
	  else if (ContextMenudemo[itemIndex].cmdId == DECMD_IMAGEPROPERTIES) {
	    OpenImageLoadWindowdemo(theObject);
	  }
	  else {
	    theObject.ExecCommand(ContextMenudemo[itemIndex].cmdId, OLECMDEXECOPT_DODEFAULT);
	  }
	}
	
	// DisplayChanged handler. A Very time-critical routine; this is called
	// every time a character is typed. QueryStatus those toolbar buttons that need
	// to be in synch with the current state of the document and update. 
	function DisplayChangeddemo(theObject) {
	if (initialDocComplete){
	  var i, s;
	  for (i=0; i<QueryStatusToolbarButtonsdemo.length; i++) {
			s = theObject.QueryStatus(QueryStatusToolbarButtonsdemo[i].command);
	      	if (s == DECMDF_DISABLED || s == DECMDF_NOTSUPPORTED || bTextModedemo) {
				TBSetStatedemo(QueryStatusToolbarButtonsdemo[i].element, "gray");
			} else if (s == DECMDF_ENABLED  || s == DECMDF_NINCHED || bTextModedemo) {
	       		TBSetStatedemo(QueryStatusToolbarButtonsdemo[i].element, "unchecked"); 
	    	} else { // DECMDF_LATCHED
	       		TBSetStatedemo(QueryStatusToolbarButtonsdemo[i].element, "checked");
	    	}
	  };
	  
	  
	   if (bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_INSERTTABLEdemo"], "gray");
	  	} else {
		  TBSetStatedemo(document.body.all["DECMD_INSERTTABLEdemo"], "unchecked");
	  	};
	  
   	  
	  
	   if (bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_VISIBLEBORDERSdemo"], "gray");
		  TBSetStatedemo(document.body.all["DECMD_SHOWDETAILSdemo"], "gray");
		  TBSetStatedemo(document.body.all["DECMD_SNAPTOGRIDdemo"], "gray");
	  	} else {
		  TBSetStatedemo(document.body.all["DECMD_VISIBLEBORDERSdemo"], "unchecked");
		  TBSetStatedemo(document.body.all["DECMD_SHOWDETAILSdemo"], "unchecked");
		  TBSetStatedemo(document.body.all["DECMD_SNAPTOGRIDdemo"], "unchecked");
	  	};
	  
   	  
	   
	   var selection = theObject.DOM.selection;
	   if (selection.type == "Text" || selection.type == "Control" || selection.type != "None" || bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_PHARAGRAPHdemo"], "gray");
	   } else {
		  TBSetStatedemo(document.body.all["DECMD_PHARAGRAPHdemo"], "unchecked");
	   };
	   if (selection.type == "Text" || selection.type == "Control" || selection.type != "None" || bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_BREAKdemo"], "gray");
	   } else {
		  TBSetStatedemo(document.body.all["DECMD_BREAKdemo"], "unchecked");
	   };
	   if (selection.type == "Text" || selection.type == "Control" || selection.type != "None" || bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_NBSPdemo"], "gray");
	   } else {
		  TBSetStatedemo(document.body.all["DECMD_NBSPdemo"], "unchecked");
	   };
	    if (selection.type == "Text" || selection.type == "Control" || selection.type != "None" || bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_INSERTCHRdemo"], "gray");
	   } else {
		  TBSetStatedemo(document.body.all["DECMD_INSERTCHRdemo"], "unchecked");
	   };   
	   if (selection.type == "Text" || selection.type == "Control" || selection.type != "None" || bTextModedemo){
		  TBSetStatedemo(document.body.all["DECMD_HLINEdemo"], "gray");
	   } else {
		  TBSetStatedemo(document.body.all["DECMD_HLINEdemo"], "unchecked");
	   };
	   
   	  
	  
	  var selection = theObject.DOM.selection;
	  if ((selection.type == "Text" || selection.type == "None") && !bTextModedemo){
	    cont = selection.createRange();
	    typeOfTag = cont.parentElement();
	      if (typeOfTag.tagName == "SUP") {
		  	  TBSetStatedemo(document.body.all["DECMD_SUPERSCRIPTdemo"], "checked");
		  } else {
			  TBSetStatedemo(document.body.all["DECMD_SUPERSCRIPTdemo"], "unchecked");
		  };
		  
		  if (typeOfTag.tagName == "SUB") {
		  	  TBSetStatedemo(document.body.all["DECMD_SUBSCRIPTdemo"], "checked");
		  } else {
			  TBSetStatedemo(document.body.all["DECMD_SUBSCRIPTdemo"], "unchecked");
		  };
	  }
	  else {
		  TBSetStatedemo(document.body.all["DECMD_SUPERSCRIPTdemo"], "gray");
		  TBSetStatedemo(document.body.all["DECMD_SUBSCRIPTdemo"], "gray");
	  };
      
	  
	  s = theObject.QueryStatus(DECMD_GETBLOCKFMT);
	  if (s == DECMDF_DISABLED || s == DECMDF_NOTSUPPORTED || bTextModedemo) {
		  document.all.ParagraphStyledemo.disabled = true;
	  } else {
		  document.all.ParagraphStyledemo.disabled = false;
	    document.all.ParagraphStyledemo.value = theObject.ExecCommand(DECMD_GETBLOCKFMT, OLECMDEXECOPT_DODEFAULT);
	  }
	  
	  s = theObject.QueryStatus(DECMD_GETFONTNAME);
	  if (s == DECMDF_DISABLED || s == DECMDF_NOTSUPPORTED || bTextModedemo) {
		document.all.FontNamedemo.disabled = true;
	  } else {
		document.all.FontNamedemo.disabled = false;
	    document.all.FontNamedemo.value = theObject.ExecCommand(DECMD_GETFONTNAME, OLECMDEXECOPT_DODEFAULT);
	  }
	  
	  if (s == DECMDF_DISABLED || s == DECMDF_NOTSUPPORTED || bTextModedemo) {
		document.all.FontSizedemo.disabled = true;
	  } else {
		document.all.FontSizedemo.disabled = false;
	    document.all.FontSizedemo.value = theObject.ExecCommand(DECMD_GETFONTSIZE, OLECMDEXECOPT_DODEFAULT);
	  }
	  
	  }  
	}
	
	function DECMD_onclickdemo(cmd, theObject) {
	if (!isRTextModedemo(theObject)) return;
	  theObject.ExecCommand(cmd,OLECMDEXECOPT_DODEFAULT);
	  theObject.focus();
	}
	
	function DECMD_VISIBLEBORDERS_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  theObject.ShowBorders = !theObject.ShowBorders;
	  theObject.focus();
	}
	
	function DECMD_SHOWDETAILS_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  theObject.ShowDetails = !theObject.ShowDetails;
	  theObject.focus();
	}
	
	function DECMD_SNAPTOGRID_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  theObject.SnapToGrid = !theObject.SnapToGrid;
	  theObject.focus();
	}
	
	function DECMD_SETFORECOLOR_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  var arr = showModalDialog( "eConstruct_editor_selcolor.cfm",
	                             "",
	                             "dialogWidth: 230px; dialogHeight:310px; status: no; scroll: no; edge: sunken;");
	
	  if (arr != null) {
	    theObject.ExecCommand(DECMD_SETFORECOLOR,OLECMDEXECOPT_DODEFAULT, arr);
	  }
	  theObject.focus();
	}
	
	function DECMD_SETBACKCOLOR_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  var arr = showModalDialog( "eConstruct_editor_selcolor.cfm",
	                             "",
	                             "dialogWidth: 230px; dialogHeight:310px; status: no; scroll: no; edge: sunken;");
	
	  if (arr != null) {
	    theObject.ExecCommand(DECMD_SETBACKCOLOR,OLECMDEXECOPT_DODEFAULT, arr);
	  }
	  theObject.focus();
	}

	function SUPERSCRIPT_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  insertTextdemo('<sup>','</sup>',true,false,theObject.id);
	  ObjEditordemo.focus();
	}
	
	function SUBSCRIPT_onclickdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  insertTextdemo('<sub>','</sub>',true,false,theObject.id);
	  theObject.focus();
	}
		
	function ParagraphStyle_onchangedemo(theObject) {	 
	  if (!isRTextModedemo(theObject)) return;
	  theObject.ExecCommand(DECMD_SETBLOCKFMT, OLECMDEXECOPT_DODEFAULT, document.all.ParagraphStyledemo.value);
	  theObject.focus();
	}
	
	function FontName_onchangedemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  theObject.ExecCommand(DECMD_SETFONTNAME, OLECMDEXECOPT_DODEFAULT, document.all.FontNamedemo.value);
	  theObject.focus();
	}
	
	function FontSize_onchangedemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  theFontSize = document.all.FontSizedemo.value;
	  theObject.ExecCommand(DECMD_SETFONTSIZE, OLECMDEXECOPT_DODEFAULT, parseInt(theFontSize));
	  theObject.focus();
	}

	function extChars_onchangedemo(theObject) {
	   if (!isRTextModedemo(theObject)) return; 
	  extChars = document.all.extCharsdemo.value;
	  insertTextdemo(extChars,'',true,true,theObject.id);
	  theObject.focus();
	}
		
	function insertTextdemo(tagStart, tagEnd, asHTML, bAllowEmpty, theObjectAsText) {
	
      theObject = document.body.all[""+theObjectAsText+""];
	  
	  if (!isRTextModedemo(theObject)) return false;
	
	  var selection = theObject.DOM.selection;
	  if (!bAllowEmpty && selection.type == "None") return;
	  cont = selection.createRange();
	  if (selection.type == "Control"){
	    var theHTML = cont.item(0).outerHTML;
	    cont.item(0).outerHTML = tagStart + theHTML + tagEnd;
	  }else {
	    if (asHTML) {
	      if (selection.type == "None") {
	        cont.pasteHTML(tagStart + tagEnd);      
	      } else {
	        cont.pasteHTML(tagStart + cont.htmlText + tagEnd);      
	      }
	    }
	    else {
	      cont.text = tagStart + cont.text + tagEnd;
	    }
	  }
	 	theObject.focus();  
	}

	function DocumentCompletedemo(theObject) {
		initialDocComplete = true;
	    docComplete = true;		
		//Populate DHTML Editing box with document loaded in the hidden editor
		temp = document.all.demo;
		if(temp.value.length){
			theObject.DOM.body.innerHTML = temp.value;	
		}
		else {
			theObject.DOM.body.innerHTML = " ";
		};
		initdemo();		
	 }
	
	
	function saveItdemo() {
	  theObject = ObjEditordemo;
	  theForm = window.document.sampleForm;
      html = theObject.DOM.body.innerHTML;
      theForm.demo.value = html;
    }
	
	
	//Switches between text and html mode.
	function setModedemo(newMode, theObject) {
	  bTextModedemo = newMode;
	  var cont;
	  if (bTextModedemo) {
		cleanHtmldemo(theObject);
		theObject.DOM.body.style.fontFamily="Courier New";
		theObject.DOM.body.style.fontSize="10pt";
	    cont=theObject.DOM.body.innerHTML;
	    theObject.DOM.body.innerText=cont;
		statusAreademo.innerText = "HTML Source Mode";
	  } else {
	    theObject.DOM.body.style.fontFamily="Times New Roman";
		theObject.DOM.body.style.fontSize="12pt";
	    cont=theObject.DOM.body.innerText;
	    theObject.DOM.body.innerHTML=cont;
		statusAreademo.innerText = "Design Mode";
	  }
	  
	  theObject.focus();
	}
	
	function cleanHtmldemo(theObject) {
	  var fonts =  theObject.DOM.body.all.tags("FONT");
	  var curr;
	  for (var i = fonts.length - 1; i >= 0; i--) {
	    curr = fonts[i];
	    if (curr.style.backgroundColor == "#ffffff") curr.outerHTML = curr.innerHTML;
	  }
	}
	
	// Check if toolbar is being used when in text mode
	function isRTextModedemo(theObject) {
	  if (! bTextModedemo) return true;
	  theObject.focus();
	  return false;
	}

	function OpenImageLoadWindowdemo(theObject){
	  if (!isRTextModedemo(theObject)) return false;
	  var w = 600;
	  var h = 370;
	  
	  var theSource = "";
	  var theSrc = "";
	  var theBorder = "0";
	  var theWidth = "";
	  var theHeight = "";
	  var theAlt = "";
	  var theAlign = "";
	  var theHSpace = "";
	  var theVSpace = "";
	  var editImage = "0";	  
	  
	  var selection = theObject.DOM.selection;
	  var cont = selection.createRange();
	  if (selection.type == "Control") {
	  	if (cont.item(0).tagName == "IMG") {
		   theSource = cont.item(0);
		   var theSrc = theSource.src;
		   var element = ObjEditordemo
		  
           if (element.BaseURL.length > 0) {
		        theBaseURL=new RegExp(element.BaseURL,"ig");
		   		theSrc = theSrc.replace(theBaseURL, "");
            }
      	 }
	  }
	  
	  //Set the open window params
	  if (theSource){
        theBorder = theSource.border;
        theWidth = theSource.width;
		theHeight = theSource.height;
		theAlt = theSource.alt;
		theAlign = theSource.align;
		theHSpace = theSource.hspace;
		theVSpace = theSource.vspace;
		editImage = "1";
	  }
	  
	  var mypage = 'eConstruct_editor_imageSelect.cfm?documentBaseURL=http%3A%2F%2Fwww%2Ecf%2Dacs%2Ecom%2FeconstructEditor%2Fsample%2F&imageSource=images&documentPath=c%3A%5Chttp%5Cacs%5CeconstructEditor%5Csample%5C&allowImageFileUpload=no&allowImageDelete=no&allowMakeFolder=no&allowRemoveFolder=no&editorName=demo&theObject='+theObject.id+'&theSource='+theSrc+'&theBorder='+theBorder+'&theWidth='+theWidth+'&theHeight='+theHeight+'&theAlt='+theAlt+'&theAlign='+theAlign+'&theHSpace='+theHSpace+'&theVSpace='+theVSpace+'&editImage='+editImage;
	  var myname = 'ImageWindowLoad';
	  var winl = (screen.width - w) / 2;
	  var wint = (screen.height - h) / 2;
	  winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=yes';
	  win = window.open(mypage, myname, winprops)
	  if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
	}
	
	function postImagedemo(src, align, border, altText, width, height, hspace, vspace, theObjectAsText) {
	  theObject = document.body.all[""+theObjectAsText+""];
	  if (!isRTextModedemo(theObject)) return false;
	  
	  selection = theObject.DOM.selection;
	  cont = selection.createRange();
	  
	  if (selection.type == "Text" || selection.type == "None"){
	     cont.pasteHTML("<img src=\""+src+"\" align=\""+align+"\" border=\""+border+"\" alt=\""+altText+"\" width=\""+width+"\" height=\""+height+"\" hspace=\""+hspace+"\" vspace=\""+vspace+"\">"); 
	  }
	  else if (selection.type == "Control") {
		 theImage = cont.item(0);
	     theImage.outerHTML = "<img src=\""+src+"\" align=\""+align+"\" border=\""+border+"\" alt=\""+altText+"\" width=\""+width+"\" height=\""+height+"\" hspace=\""+hspace+"\" vspace=\""+vspace+"\">";	
	  }
	}
		
	function OpenAddTableWindowdemo(theObject){
	  if (!isRTextModedemo(theObject)) return false;
	  var w = 468;
	  var h = 190;
	  
	  var theTable = "";
	  var theRows = "1";
	  var theCols = "1";
	  var theBorder = "1";
	  var theWidth = "100";
	  var theHeight = "";
	  var theBGColor = "";
	  var theCellPadding = "1";
	  var theCellSpacing = "0";
	  var theAlign = "";
	  var editTable = "0";	  
	  
	  var selection = theObject.DOM.selection;
	  var cont = selection.createRange();
	  
	  if (selection.type == "Text" || selection.type == "None"){
	     typeOfTag = cont.parentElement();
		
		  while (typeOfTag.tagName != "BODY" && typeOfTag.tagName != "TD") {
		    if (typeOfTag.tagName == "TABLE") {
	    	  theTable = typeOfTag;
	    	}
	    	typeOfTag = typeOfTag.parentElement;
	  	  }
	  }
      else if (selection.type == "Control") {
	  	if (cont.item(0).tagName == "TABLE") {
		 theTable = cont.item(0);
		}
		else return;
	  }
	  else return;
	  
	  //Set the open window params
	  if (theTable){ 
        theRows = theTable.rows.length;
		theCols = Math.round(theTable.cells.length/theTable.rows.length);
		theBorder = theTable.border;
        theWidth = theTable.width;
		theHeight = theTable.height;
		theBGColor = theTable.bgColor;
		theCellPadding = theTable.cellPadding;
		theCellSpacing = theTable.cellSpacing;
		theAlign = theTable.align;
		editTable = "1";
	  }
	  var mypage = 'eConstruct_editor_createTable.cfm?editorName=demo&theObject='+theObject.id+'&theRows='+theRows+'&theCols='+theCols+'&theBorder='+theBorder+'&theWidth='+theWidth+'&theHeight='+theHeight+'&theBGColor='+escape(theBGColor)+'&theCellPadding='+theCellPadding+'&theCellSpacing='+theCellSpacing+'&theAlign='+theAlign+'&editTable='+editTable;
	  var myname = 'EditTableWindow';
	  var winl = (screen.width - w) / 2;
	  var wint = (screen.height - h) / 2;
	  winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no';
	  win = window.open(mypage, myname, winprops)
	  if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
	}
	
	function postTabledemo(rows, cols, border, width, height, bgcolor, cellpadding, cellspacing, align, theObjectAsText) {
	  theTableInfo = window.document.all.ObjTableInfoBoxdemo;
	  theObject = document.body.all[""+theObjectAsText+""];
	  if (!isRTextModedemo(theObject)) return false;
	  
	  theTable = "";
	  selection = theObject.DOM.selection;
	  cont = selection.createRange();
	  
	    if (selection.type == "Text" || selection.type == "None"){ 
	     typeOfTag = cont.parentElement();
		 		 
		  while (typeOfTag.tagName != "BODY" && typeOfTag.tagName != "TD") {
		    if (typeOfTag.tagName == "TABLE") {
	    	  theTable = typeOfTag;
	    	}
	    	typeOfTag = typeOfTag.parentElement;
	  	  }
		  
		}
		else if (selection.type == "Control") {
	  	  if (cont.item(0).tagName == "TABLE") {
		    theTable = cont.item(0);
		  }
	    }
	    else return;
		
		if (theTable) {
		  theTable.border = border;
		  theTable.width = width;
		  theTable.height = height;
		  theTable.bgColor = bgcolor;
		  theTable.cellPadding = cellpadding;
		  theTable.cellSpacing = cellspacing;
		  theTable.align = align;
	   	}
	     	    
	    if (!theTable){
			theTableInfo.NumRows = rows;
	     	theTableInfo.NumCols = cols;
	     	theTableInfo.TableAttrs = "border=\"" + border + "\" cellPadding=\"" + cellpadding + "\" cellSpacing=\"" + cellspacing + "\" width=\"" + width + "\" height=\"" + height + "\" bgcolor=\"" + bgcolor + "\" align=\"" + align + "\"";
	     	theObject.ExecCommand(DECMD_INSERTTABLE,0, theTableInfo);
	    }
	}
	
	function OpenAddChrWindowdemo(theObject) {
	  if (!isRTextModedemo(theObject)) return;
	  var arr = showModalDialog( "eConstruct_editor_selchar.cfm",
	                             "",
	                             "dialogWidth: 230px; dialogHeight:310px; status: no; scroll: no; edge: sunken;");
	
	  if (arr != null) {
	    if (arr != "TM") {
		  insertTextdemo(arr,'',true,true,theObject.id);
		}
		else {
		  insertTextdemo('<sup><font size="-1">TM</font>','</sup>',true,true,theObject.id);
		}
	  }
	  theObject.focus();
	}
	
	function OpenHyperlinkWindowdemo(theObject){
	  if (!isRTextModedemo(theObject)) return false;
	  var w = 580;
	  var h = 290;
	  var theHREF = "";
	  var theImage = "";
	  var theName = "";
	  var theTarget = "";
	  var theStyle = "";
	  
	  var selection = theObject.DOM.selection;
	  var cont = selection.createRange();
	  if (selection.type == "Text" || selection.type == "None"){
	     typeOfTag = cont.parentElement();
		
		  while (typeOfTag.tagName != "BODY") {
		    if (typeOfTag.tagName == "A") {
	    	  theHREF = typeOfTag;
	    	}
	    	typeOfTag = typeOfTag.parentElement;
	  	  }
	  }
      else if (selection.type == "Control") {
	  	if (cont.item(0).tagName == "IMG") {
		 theImage = cont.item(0);
      	 theParent = cont.item(0).parentElement;
	     if (theParent.tagName == "A") {
           theHREF = theParent;
         }
		}
	  }
	  else return;
	  
	  //Set the open window params
	  if (theHREF){
        theName = theHREF.name;
        theTarget = theHREF.target;
	    theStyle = theHREF.style.cssText;
	  }
	  
	  var mypage = 'eConstruct_editor_hyperlink.cfm?editorName=demo&documentBaseURL=http%3A%2F%2Fwww%2Ecf%2Dacs%2Ecom%2FeconstructEditor%2Fsample%2F&documentPath=c%3A%5Chttp%5Cacs%5CeconstructEditor%5Csample%5C&theObject='+theObject.id+'&theURL='+theHREF+'&theName='+theName+'&theTarget='+theTarget+'&theStyle='+theStyle;
	  var myname = 'ImageWindowLoad';
	  var winl = (screen.width - w) / 2;
	  var wint = (screen.height - h) / 2;
	  winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=yes';
	  win = window.open(mypage, myname, winprops)
	  if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
	}
	
	function postHyperlinkdemo(url, target, name, style, theObjectAsText) {
	  theObject = document.body.all[""+theObjectAsText+""];
	  if (!isRTextModedemo(theObject)) return false;
	  
	  theHREF = "";
	  selection = theObject.DOM.selection;
	  cont = selection.createRange();
	    if (selection.type == "Text" || selection.type == "None"){ 
	     typeOfTag = cont.parentElement();
		}
		else if (selection.type == "Control"){
		 typeOfTag = cont.item(0).parentElement;
		}
		
		while (typeOfTag.tagName != "BODY") {
			if (typeOfTag.tagName == "A") {
	    	  theHREF = typeOfTag;
			  theHREF.href = url;    
              theHREF.target = target;
              theHREF.name = name;
			  theHREF.style.cssText = style;
	    	}
	    	typeOfTag = typeOfTag.parentElement;
	  	}
	    
	    if (!theHREF){
			if (selection.type == "Text" || selection.type == "None"){
		      cont.pasteHTML("<a href=\"" + url + "\" target=\"" + target + "\" name=\"" + name + "\" style=\"" + style + "\">" + cont.htmlText + "</a>"); 
			}
			else if (selection.type == "Control") {
	  	      theImage = cont.item(0);
	          theImage.outerHTML = "<a href=\"" + url + "\" target=\"" + target + "\" name=\"" + name + "\" style=\"" + style + "\">" + theImage.outerHTML + "</a>";	
	        }
	    }
	}
	//-->
	</script>
	
	<script LANGUAGE="javascript" FOR="tbContentElementBoxdemo" EVENT="DisplayChanged">
	<!--
	return DisplayChangeddemo(ObjEditordemo);
	//-->
	</script>
	<script LANGUAGE="javascript" FOR="tbContentElementBoxdemo" EVENT="ShowContextMenu">
	<!--
	return ShowContextMenudemo(ObjEditordemo);
	//-->
	</script>
	<script LANGUAGE="javascript" FOR="tbContentElementBoxdemo" EVENT="ContextMenuAction(itemIndex)">
	<!--
	return ContextMenuActiondemo(itemIndex, ObjEditordemo);
	//-->
	</script>
	<SCRIPT LANGUAGE="javascript" FOR="tbContentElementBoxdemo" EVENT="DocumentComplete">
	<!--
	 DocumentCompletedemo(ObjEditordemo);
	//-->
	</SCRIPT>
<table border="0" cellspacing="0" cellpadding="0" class="tableclass" id="tableclass" align="center" width="600" height="350">
<tr><td>
<!-- Toolbars -->

<span class="tbToolbar" ID="FontToolbar" style="width:1px;">

<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt=""></td>
  <td class="tbGeneral">
  <select ID="ParagraphStyledemo" style="width:70" TITLE="Paragraph Format" LANGUAGE="javascript" onchange="return ParagraphStyle_onchangedemo(ObjEditordemo)">
    <option value="Normal" selected>Normal
    <option value="Heading 1">Heading 1
    <option value="Heading 2">Heading 2
    <option value="Heading 3">Heading 3
    <option value="Heading 4">Heading 4
    <option value="Heading 5">Heading 5
    <option value="Heading 6">Heading 6
    <option value="Address">Address
    <option value="Formatted">Formatted
  </select>
  </td>
  <td class="tbGeneral">
  <select ID="FontNamedemo" style="width:115" TITLE="Font Name" LANGUAGE="javascript" onchange="return FontName_onchangedemo(ObjEditordemo)">
   <option value="Arial" selected>Arial
    <option value="Arial Black">Arial Black
    <option value="Arial Narrow">Arial Narrow
    <option value="Courier New">Courier New
    <option value="System">System
	<option value="Tahoma">Tahoma
    <option value="Times New Roman">Times New Roman
    <option value="Verdana">Verdana
	<option value="Helvetica">Helvetica
  </select>
  </td>
  <td class="tbGeneral">
  <select ID="FontSizedemo" style="width:35" TITLE="Font Size" LANGUAGE="javascript" onchange="return FontSize_onchangedemo(ObjEditordemo)">
    <option value="1">1
    <option value="2">2
    <option value="3">3
    <option value="4">4
    <option value="5">5
    <option value="6">6
    <option value="7">7
  </select>
  </td>
  <td width="2"></td>
 </tr></table>
</span>

<span class="tbToolbar" ID="FontToolbar" style="width:1px;">

 <table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
  <td class="tbButton" ID="DECMD_FONTdemo" TITLE="Font" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_FONT,ObjEditordemo)">
    <img class="tbIcon" src="images/font.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_BOLDdemo" TITLE="Bold" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_BOLD,ObjEditordemo)">
    <img class="tbIcon" src="images/bold.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_ITALICdemo" TITLE="Italic" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_ITALIC,ObjEditordemo)">
    <img class="tbIcon" src="images/italic.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_UNDERLINEdemo" TITLE="Underline" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_UNDERLINE,ObjEditordemo)">
    <img class="tbIcon" src="images/under.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_SUPERSCRIPTdemo" TITLE="Superscript" TBTYPE="toggle" LANGUAGE="javascript" onclick="return SUPERSCRIPT_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/superscript.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_SUBSCRIPTdemo" TITLE="Subscript" TBTYPE="toggle" LANGUAGE="javascript" onclick="return SUBSCRIPT_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/subscript.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_SETFORECOLORdemo" TITLE="Foreground Color" LANGUAGE="javascript" onclick="return DECMD_SETFORECOLOR_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/tpaint.GIF" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_SETBACKCOLORdemo" TITLE="Background Color" LANGUAGE="javascript" onclick="return DECMD_SETBACKCOLOR_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/parea.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td width="2"></td>
</tr></table>

</span>

<span class="tbToolbar" ID="EditToolbar" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
 <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
 <td class="tbButton" ID="DECMD_CUTdemo" TITLE="Cut" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_CUT,ObjEditordemo)">
   <img class="tbIcon" src="images/cut.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
 <td class="tbButton" ID="DECMD_COPYdemo" TITLE="Copy" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_COPY,ObjEditordemo)">
   <img class="tbIcon" src="images/copy.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
 <td class="tbButton" ID="DECMD_PASTEdemo" TITLE="Paste" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_PASTE,ObjEditordemo)">
   <img class="tbIcon" src="images/paste.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
 <td><div class="tbSeparator"></div></td>
 <td class="tbButton" ID="DECMD_UNDOdemo" TITLE="Undo" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_UNDO,ObjEditordemo)">
   <img class="tbIcon" src="images/undo.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
 <td class="tbButton" ID="DECMD_REDOdemo" TITLE="Redo" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_REDO,ObjEditordemo)">
   <img class="tbIcon" src="images/redo.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
 <td><div class="tbSeparator"></div></td>
 <td class="tbButton" ID="DECMD_FINDTEXTdemo" TITLE="Find" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_FINDTEXT,ObjEditordemo)">
   <img class="tbIcon" src="images/find.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
 </td>
<td width="2"></td>
</tr></table>
</span>

<span class="tbToolbar" ID="CommonToolbar" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
 <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
 <td class="tbButton" ID="DECMD_PHARAGRAPHdemo" TITLE="Pharagraph" LANGUAGE="javascript" onclick="return insertTextdemo('<p>', '</p>',true,true,ObjEditordemo.id)">
    <img class="tbIcon" src="images/pharagraph.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle" alt="">
  </td>
 <td class="tbButton" ID="DECMD_BREAKdemo" TITLE="Break" LANGUAGE="javascript" onclick="return insertTextdemo('<br>', '',true,true,ObjEditordemo.id)">
    <img class="tbIcon" src="images/break.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle" alt="">
  </td>
 <td class="tbButton" ID="DECMD_NBSPdemo" TITLE="Space" LANGUAGE="javascript" onclick="return insertTextdemo('&nbsp;', '',true,true,ObjEditordemo.id)">
    <img class="tbIcon" src="images/nbsp.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle" alt="">
  </td>
 <td class="tbButton" ID="DECMD_INSERTCHRdemo" TITLE="Insert Table" LANGUAGE="javascript" onclick="return OpenAddChrWindowdemo(ObjEditordemo)">
	<img class="tbIcon" src="images/extChars.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle" alt="">
</td>
 <td><div class="tbSeparator"></div></td>
 <td class="tbButton" ID="DECMD_HLINEdemo" TITLE="Horizontal Line" LANGUAGE="javascript" onclick="return insertTextdemo('<hr size=1 noshade>', '',true,true,ObjEditordemo.id)">
    <img class="tbIcon" src="images/hline.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_HYPERLINKdemo" TITLE="Link" LANGUAGE="javascript" onclick="return OpenHyperlinkWindowdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/link.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_IMAGEdemo" TITLE="Insert Image" LANGUAGE="javascript" onclick="return OpenImageLoadWindowdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/image.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_JUSTIFYLEFTdemo" TITLE="Align Left" TBTYPE="toggle" NAME="Justify" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_JUSTIFYLEFT,ObjEditordemo)">
    <img class="tbIcon" src="images/left.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_JUSTIFYCENTERdemo" TITLE="Center" TBTYPE="toggle" NAME="Justify" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_JUSTIFYCENTER,ObjEditordemo)">
    <img class="tbIcon" src="images/center.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_JUSTIFYRIGHTdemo" TITLE="Align Right" TBTYPE="toggle" NAME="Justify" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_JUSTIFYRIGHT,ObjEditordemo)">
    <img class="tbIcon" src="images/right.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>  
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_OUTDENTdemo" TITLE="Decrease Indent" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_OUTDENT,ObjEditordemo)">
    <img class="tbIcon" src="images/deindent.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_INDENTdemo" TITLE="Increase Indent" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_INDENT,ObjEditordemo)">
    <img class="tbIcon" src="images/inindent.GIF" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
<td width="2"></td>
</tr></table>
</span>

<span class="tbToolbar" ID="ListToolbar" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
  <td class="tbButton" ID="DECMD_ORDERLISTdemo" TITLE="Numbered List" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_ORDERLIST,ObjEditordemo)">
    <img class="tbIcon" src="images/numlist.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_UNORDERLISTdemo" TITLE="Bulletted List" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_UNORDERLIST,ObjEditordemo)">
    <img class="tbIcon" src="images/bullist.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
<td width="2"></td>
</tr></table>
</span>

<span class="tbToolbar" ID="TableToolbar" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
  <td class="tbButton" ID="DECMD_INSERTTABLEdemo" TITLE="Insert Table" LANGUAGE="javascript" onclick="return OpenAddTableWindowdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/instable.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_INSERTROWdemo" TITLE="Insert Row" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_INSERTROW,ObjEditordemo)">
    <img class="tbIcon" src="images/insrow.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_DELETEROWSdemo" TITLE="Delete Rows" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_DELETEROWS,ObjEditordemo)">
    <img class="tbIcon" src="images/delrow.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td> 
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_INSERTCOLdemo" TITLE="Insert Column" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_INSERTCOL,ObjEditordemo)">
    <img class="tbIcon" src="images/inscol.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_DELETECOLSdemo" TITLE="Delete Columns" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_DELETECOLS,ObjEditordemo)">
    <img class="tbIcon" src="images/delcol.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_INSERTCELLdemo" TITLE="Insert Cell" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_INSERTCELL,ObjEditordemo)">
    <img class="tbIcon" src="images/inscell.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_DELETECELLSdemo" TITLE="Delete Cells" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_DELETECELLS,ObjEditordemo)">
    <img class="tbIcon" src="images/delcell.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_MERGECELLSdemo" TITLE="Merge Cells" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_MERGECELLS,ObjEditordemo)">
    <img class="tbIcon" src="images/mrgcell.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_SPLITCELLdemo" TITLE="Split Cells" LANGUAGE="javascript" onclick="return DECMD_onclickdemo(DECMD_SPLITCELL,ObjEditordemo)">
    <img class="tbIcon" src="images/spltcell.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
<td width="2"></td>
</tr></table>
</span>

<span class="tbToolbar" ID="AbsPosToolbar" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
  <td class="tbButton" ID="DECMD_VISIBLEBORDERSdemo" TITLE="Visible Borders" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_VISIBLEBORDERS_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/borders.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_SHOWDETAILSdemo" TITLE="Show Details" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_SHOWDETAILS_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/details.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_MAKE_ABSOLUTEdemo" TBTYPE="toggle" LANGUAGE="javascript" TITLE="Make Absolute" onclick="return DECMD_onclickdemo(DECMD_MAKE_ABSOLUTE,ObjEditordemo)">
    <img class="tbIcon" src="images/abspos.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
  <td class="tbButton" ID="DECMD_LOCK_ELEMENTdemo" TBTYPE="toggle" LANGUAGE="javascript" TITLE="Lock" onclick="return DECMD_onclickdemo(DECMD_LOCK_ELEMENT,ObjEditordemo)">
    <img class="tbIcon" src="images/lock.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
 <td><div class="tbSeparator"></div></td>
  <td class="tbButton" ID="DECMD_SNAPTOGRIDdemo" TITLE="Snap to Grid" TBTYPE="toggle" LANGUAGE="javascript" onclick="return DECMD_SNAPTOGRID_onclickdemo(ObjEditordemo)">
    <img class="tbIcon" src="images/snapgrid.gif" WIDTH="23" HEIGHT="22" border="0" align="absmiddle">
  </td>
<td width="2"></td>
</tr></table>
</span>

<span class="tbToolbar" ID="Editing Mode" style="width:1px;">
<table cellspacing="0" cellpadding="0" class="tbGeneral"><tr>
  <td class="tbGeneral"><img src="images/toolbar.gif" width="9" height="22" border="0" alt="" valign="absmiddle"></td>
  <td id="EditModedemo" class="tbGeneral" style="FONT: 7pt verdana,arial,sans-serif;" title="View HTML">
    <input type=checkbox name="switchModedemo"  onclick="setModedemo(switchModedemo.checked,ObjEditordemo)">View HTML
  </td>
<td width="2"></td>
</tr></table>
</span>

</td>
</tr>
<tr>
	<td valign="middle">
	<!-- DHTML Editing control Object. This will be the body object for the toolbars. -->
	
	 <object ID="tbContentElementBoxdemo" CLASS="tbContentElementdemo" width="100%" height="350" style="z-index:1;" classid="clsid:2D360201-FFF5-11d1-8D03-00A0C959BC0A">
		<param name=Scrollbars value=true>
	 </object>
	 
	</td>
</tr>
<tr>
	<td valign="middle">
	<table width="100%" cellspacing="1" cellpadding="2">
	<tr>
		<td><a style="text-align:center; COLOR: black; TEXT-DECORATION: none; FONT: 8pt tahoma,arial,sans-serif; vertical-align: middle;" href="http://www.cf-acs.com" target="_blank"><img src="images/eConstructLogo.gif" width="22" height="18" border="0" alt="">eConstruct! Editor &copy;2002</a></td>
		<td style="text-align:right;width:100px;border-width: 1px;border-style: solid;border-color: threeddarkshadow white white threeddarkshadow;font:8pt Tahoma;">
      	<nobr><span id="statusAreademo" style="width:95px;text-align:center;">Loading...</span></nobr></td>
	</tr>
	</table>
	</td>
</tr>
</table>

<textarea cols="80" rows="5" name="demo" style="display: none"><P align=center><FONT face=Arial color=#ff0000>Bibliography</FONT></P>
<P align=left><FONT face=Arial color=#000000 size=2><STRONG>Harness</STRONG>, <STRONG><EM>Cheryl</EM></STRONG>, <U>Young</U> <U>Abe</U> <U>Lincoln</U>, Washington D.C.: National Geographic Society, 1996</FONT></P>
<P align=left><FONT face=Arial color=#000000 size=2>"Lincoln, Abraham".&nbsp; <U>The</U> <U>World</U> <U>Book</U> <U>Encyclopedia</U>, 1st. ed. 1969.</FONT></P><FONT face=Arial size=2>
<P align=left><FONT face=Arial color=#000000 size=2>"Lincoln, Abraham".&nbsp;&nbsp;<U>World</U> <U>Book</U> <U>Millennium</U> <U>2000</U>, 1st. ed. 2000.</FONT></P>
<P align=left><FONT color=#000000>Judson, Clara. <U>Abraham</U> <U>Lincoln</U> <U>Friend</U> <U>of</U> <U>the</U> <U>People</U>. Chicago: Follett Publishing Company. 1950 </FONT></P><FONT color=#191970>
<HR color=#00bfff noShade SIZE=1>
</FONT></FONT><IMG alt="" src="images/acsLogo_bw.gif" border=0><IMG alt="" src="images/ccards-cvv2-illus.gif" border=0></textarea>
<!-- DEInsertTableParam Object -->
<object ID="ObjTableInfoBoxdemo" CLASSID="clsid:47B0DFC7-B7A3-11D1-ADC5-006008A5848C" VIEWASTEXT>
</object>
<!-- DEGetBlockFmtNamesParam Object -->
<object ID="ObjBlockFormatInfoBoxdemo" CLASSID="clsid:8D91090E-B955-11D1-ADC5-006008A5848C" VIEWASTEXT>
</object>

<!-- Toolbar Code File. Note: This must always be the last thing on the page -->
<script language="Javascript">
// Copyright 2002 Advanced Commerce Solutions. All rights reserved. 
// Author: Robert Roque
//=================================================================================================
//
// Public Style Classes
// --------------------
// tbToolbar:    Toolbar
// tbButton:     Toolbar button
// tbIcon:       Toolbar or menu icon
// tbSeparator:  Toolbar or menu separator
// tbMenu:       Pulldown menu
// tbMenuItem:   Menu item
// tbSubmenu:    Submenu
// tbGeneral:    Arbitrary HTML element in a toolbar.
// tbContentElement: Identifies an HTML element as the page body. One and only one 
//               element on the page must have this class. The element must also have 
//               its ID set to "tbContentElement".
//
// Public Attributes
// -----------------
// TBTYPE: Special type of element. Possible values are:
//   Elements: toggle
//             radio
//             <not specified> - Simple button
//
//   Toolbars: noMouseOver
//             <not specified> - Mouseover supported
//
// TBSTATE: State of the element. Possible values are:
//   Elements: gray (Disabled)
//             checked
//             unchecked
//             
//   Toolbars: dockedTop
//             dockedBottom
//             hidden
//
// tbOnMenuShow: Event handler that is called immediately prior to showing a menu or 
//   submenu. Hosts use this to set the state of menu items. This attribute can either
//   be set on individual menus and submenus, or on a toolbar in which case it is
//   fired for every menu and submenu within that toolbar. The menu that is about
//   to be shown is given in tbEventSrcElement (see below).
//
// Public Functions
// ----------------
// TBSetState(element, newState)
//   Sets the state of an element.
//     element: element to set. This is an object.
//     newState: state to set. This is a string, same values as TBSTATE.
//
// Public Globals
// --------------
// tbEventSrcElement: Contains the element that an event was fired on. The toolbar
// package doesn't support the event object; this object performs a similar function.
var tbEventSrcElement; 
//
// Public Error Return Values
// --------------------------
TB_STS_OK = "OK" // Success return
TB_E_INVALID_CLASS = "Invalid class value" // An element has an unrecognized class attribute (probably a misspelling)
TB_E_INVALID_TYPE = "Invalid TBTYPE value"
TB_E_INVALID_STATE = "Invalid TBSTATE value"
TB_E_NO_ID = "Element does not have an ID"

//
//=================================================================================================
// 
// Private Constants. These can be used along with toolbar.css to change the look of the toolbar package.
// -----------------
TB_DISABLED_OPACITY_FILTER = "alpha(opacity=25)"
//
// Private Globals
// ---------------
var ObjEditordemo = null; // Content element.
var tbRaisedElement = null; // Current toolbar button that is being shown raised.
var tbOnClickInProcess;	// Executing user's onClick event.
var tbMouseOutWhileInOnClick;  // An onmouseout event occurred while executing the user's onClick event.
//
// Functions
//
// Public function for changing an element's state. 

function TBSetStatedemo(element, newState) {

  newState = newState.toLowerCase();
  
  switch (element.className) {
    case "tbToolbar" :
      if ((newState != "dockedtop") && (newState != "dockedbottom") && (newState != "hidden")) {
        return TB_E_INVALID_STATE;    
      }
	  element.TBSTATE = newState;
      if (newState == "hidden") {
        element.style.visibility = "hidden";
      }	else {
        element.style.visibility = "visible";
      }
      //TBLayoutToolbars();
      //TBLayoutBodyElement();      
    break;
    
	case "tbButtonMouseOverUp" :
    case "tbButton" :
    case "tbButtonDown" :
    case "tbButtonMouseOverUp" :
    case "tbButtonMouseOverDown" :
    case "tbMenuItem" :

      if ((newState != "gray") && (newState != "checked") && (newState != "unchecked")) {
        return TB_E_INVALID_STATE;
      }
     
      currentState = element.TBSTATE;
      if (currentState == "") {
        currentState = "checked";
      }
      
      if (newState == currentState) {
	    return;
  	  }
	  
	    if (element.className != "tbMenuItem") {
        image = element.children.tags("IMG")[0];
     
        // Going into disabled state  
        if (newState == "gray") {
          element.className = "tbButton";  
          image.className = "tbIcon";  
          element.style.filter = TB_DISABLED_OPACITY_FILTER;
        }
      
        // Coming out of disabled state. Remove disabled look.
        if (currentState == "gray") {
          element.style.filter = "";
        }
      
        if (newState == "checked") {
           element.className = "tbButtonDown";  
           image.className = "tbIconDown";
        } else { //unchecked
           element.className = "tbButton";  
           image.className = "tbIcon";
        }  
      }

      if ((element.TBTYPE == "radio") && (newState == "checked")) {
        radioButtons = element.parentElement.children;
        for (i=0; i<radioButtons.length; i++) {
          if ((radioButtons[i].NAME == element.NAME) && (radioButtons[i] != element)) {
            radioButtons[i].TBSTATE = "unchecked";
            
  	        if (element.className != "tbMenuItem") {
              radioButtons[i].className = "tbButton";
              radioButtons[i].children.tags("IMG")[0].className = "tbIcon";
			      }
          }
        }
      }
      
      element.TBSTATE = newState;
      break;
      
    default :
      return TB_E_INVALID_CLASS;
  }
  return TB_STS_OK;
} //TBSetState


// Event handler for onmouseover events.
function TBContentElementMouseOver() {
  if (tbRaisedElement) {
	switch (tbRaisedElement.className) {
	  case "tbMenu" :
	    // Note: TBShowNormal is in tbmenus.js.
		TBShowNormal(tbRaisedElement);
      break;
		 
	  case "tbButtonMouseOverUp" :
	    tbRaisedElement.className = "tbButton";
	  break;
	    
	  case "tbButtonMouseOverDown" :
	    tbRaisedElement.className = "tbButtonDown";
	  break;
	}
    tbRaisedElement = null;
  }
}

//Prevent Right Clicks
function right(e) {
	
}
	
// Global onmouseup handler.
function TBGlobalMouseUp() {
	document.onmouseup=right;
	if (document.layers) window.captureEvents(Event.MOUSEUP);
	window.onmouseup=right;
}

// Global onmousedown handler.
function TBGlobalMouseDown() {
	document.onmousedown=right;
	if (document.layers) window.captureEvents(Event.MOUSEDOWN);
	window.onmousedown=right;
}

// Handler that simply cancels an event
function TBCancelEvent() {
  event.returnValue=false;
  event.cancelBubble=true;
}

// Toolbar button onmouseover handler
function TBButtonMouseOver() {
  var element, image;
  
  image = event.srcElement;
  element = image.parentElement;

  if (element.TBSTATE == "gray") {
    event.cancelBubble=true;
	return;
  }
  // Change button look based on current state of image.
  if (image.className == "tbIcon") {
    element.className = "tbButtonMouseOverUp";
    tbRaisedElement = element;
  } else if (image.className == "tbIconDown") {
    element.className = "tbButtonMouseOverDown";
  }
  event.cancelBubble=true;
  
} // TBButtonMouseOver

// Toolbar button onmouseout handler
function TBButtonMouseOut() {
  var element, image;
 
  image = event.srcElement;
  element = image.parentElement;
  if (element.TBSTATE == "gray") {
	event.cancelBubble=true;
    return;
  }
  
  tbRaisedElement = null;
  
  // Are we in the middle of an onClick event? Set a flag for the onclick handler and return if so.
  if (tbOnClickInProcess) {
    tbMouseOutWhileInOnClick = true;
    return;
  }

  switch (image.className) {
    case "tbIcon" :
      // Is the user cancelling unchecking a toggle/radio button by moving out?
      if (((element.TBTYPE == "toggle") || (element.TBTYPE == "radio")) && (element.TBSTATE == "checked")) {
        element.className = "tbButtonDown";
        image.className = "tbIconDown";
      } else {
        element.className = "tbButton";
      }
    break;
      
    case "tbIconDown" :
      // Is the user cancelling checking a toggle/radio button by moving out?
      if (((element.TBTYPE == "toggle") || (element.TBTYPE == "radio")) && (element.TBSTATE == "unchecked")) {
        element.className = "tbButton";
        image.className = "tbIcon";
      } else {
        element.className = "tbButtonDown"
      }
    break;
      
    case "tbIconDownPressed" :
      // The only time we'll see this is if the user is cancelling unchecking a checked toggle/radio
      element.className = "tbButtonDown";
      image.className = "tbIconDown";
    break;  
  }
  
  event.cancelBubble=true;
  
} // TBButtonMouseOut

// Toolbar button onmouseup handler
function TBButtonMouseUp() {
  var element, image, userOnClick, radioButtons, i;
 
  if (event.srcElement.tagName == "IMG") {
    image = event.srcElement;
    element = image.parentElement;
  } else {
    element = event.srcElement;
    image = element.children.tags("IMG")[0];
  }
  
  if (element.TBSTATE == "gray") {
    event.cancelBubble=true;
	return;
  }

  // Make sure this is one of our events
  if ((image.className != "tbIcon") && (image.className != "tbIconDown") && (image.className != "tbIconDownPressed")) {
	return;
  }

  // Initialize tbEventSrcElement so that the user's onClick handler can find out where the
  // event is coming from
  tbEventSrcElement = element;
  
  // Execute the  onclick handler that was on the event originally (user's onclick handler).
  // This is a little tricky; we have to call the anonymous function wrapper that was put around
  // the event by IE. Also, we set a global flag so that we can find out if a mouseout event occurs
  // while processing the user's onclick handler. mouseout and onclick behavior have to change
  // if this happens.
  tbOnClickInProcess = true;
  tbMouseOutWhileInOnClick = false;
  if (element.TBUSERONCLICK) {
    eval(element.TBUSERONCLICK + "anonymous()");
  }
  tbOnClickInProcess = false;
  
  // Is the nomouseover flag set on the toolbar?
  if (element.parentElement.TBTYPE == "nomouseover") {
    tbMouseOutWhileInOnClick = true;
  }

  //Update state and appearance based on type of button
  switch (element.TBTYPE) {
    case "toggle" :
      if (element.TBSTATE == "checked") {
        element.TBSTATE = "unchecked";
        if (tbMouseOutWhileInOnClick) {
          element.className = "tbButton";
        } else {
          element.className = "tbButtonMouseOverUp";
        }
        image.className = "tbIcon";
      } else {
        element.TBSTATE = "checked";
        if (tbMouseOutWhileInOnClick) {
          element.className = "tbButtonDown";
        } else {
          element.className = "tbButtonMouseOverDown";
        }
        image.className = "tbIconDown";
      }
    break;
      
    case "radio" :
      // Turn this element on if its not already on
      if (element.TBSTATE == "checked"){
        image.className = "tbIconDown";
        break;
      }
      element.TBSTATE = "checked";
      if (tbMouseOutWhileInOnClick) {
        element.className = "tbButtonDown";
      } else {
        element.className = "tbButtonMouseOverDown";
      }
      image.className = "tbIconDown";
    
      // Turn off every other radio button in this group by going through everything in the parent container
      radioButtons = element.parentElement.children;
      for (i=0; i<radioButtons.length; i++) {
        if ((radioButtons[i].NAME == element.NAME) && (radioButtons[i] != element)) {
          radioButtons[i].TBSTATE = "unchecked";
          radioButtons[i].className = "tbButton";
          radioButtons[i].children.tags("IMG")[0].className = "tbIcon";
        }
      }
    break;
    
    default : // Regular button
      if (tbMouseOutWhileInOnClick) {
        element.className = "tbButton";
      } else {
        element.className = "tbButtonMouseOverUp";
      }
      image.className = "tbIcon";
  }
  
  event.cancelBubble=true;
  return false;
  
} // TBButtonMouseUp

// Initialize a toolbar button
function TBInitButton(element, mouseOver) {
  var image;
 
  // Make user-settable properties all lowercase and do a validity check
  if (element.TBTYPE) {
    element.TBTYPE = element.TBTYPE.toLowerCase();
    if ((element.TBTYPE != "toggle") && (element.TBTYPE != "radio")) {
      return TB_E_INVALID_TYPE;
    }
  }
  if (element.TBSTATE) {
    element.TBSTATE = element.TBSTATE.toLowerCase();
    if ((element.TBSTATE != "gray") && (element.TBSTATE != "checked") && (element.TBSTATE != "unchecked")) {
      return TB_E_INVALID_STATE;
    }
  }
 
  image = element.children.tags("IMG")[0]; 

  // Set up all our event handlers
  if (mouseOver) {
    element.onmouseover = TBButtonMouseOver;
    element.onmouseout = TBButtonMouseOut;
  }
  element.onmousedown = TBGlobalMouseDown; 
  element.onmouseup = TBButtonMouseUp; 
  element.ondragstart = TBCancelEvent;
  element.onselectstart = TBCancelEvent;
  element.onselect = TBCancelEvent;
  element.TBUSERONCLICK = element.onclick; // Save away the original onclick event
  element.onclick = TBCancelEvent;
   
  // Set up initial button state
  if (element.TBSTATE == "gray") {
    element.style.filter = TB_DISABLED_OPACITY_FILTER;
    return TB_STS_OK;
  }
  if (element.TBTYPE == "toggle" || element.TBTYPE == "radio") {
    if (element.TBSTATE == "checked") {
      element.className = "tbButtonDown";
      image.className = "tbIconDown";
    } else {
      element.TBSTATE = "unchecked";
    }
  }
  element.TBINITIALIZED = true;
  return TB_STS_OK;
} // TBInitButton

// Initialize everything when the document is ready
function document.onreadystatechange() {
  document.body.scroll = "yes";
  
  // Find all the buttons and initialize them. 
  for (i=0; i<document.body.all.length; i++) {
    if (document.body.all[i].className == "tbButton") {
	 TBInitButton(document.body.all[i], true)
	  }
  }
  
  // Grab global mouse events.
  TBGlobalMouseDown();
  document.onmouseup = TBGlobalMouseUp;
  document.ondragstart = TBCancelEvent;
  document.onselectstart = TBCancelEvent;
}

//
// Immediately executed code
//
{
  
  	  ObjEditordemo = document.body.all["tbContentElementBoxdemo"];
	  
	  //Set the base url
	  ObjEditordemo.baseURL = "http://www.cf-acs.com/econstructEditor/sample/";
	  ObjTableInfodemo = document.body.all["ObjTableInfoBoxdemo"];
	  ObjBlockFormatInfodemo = document.body.all["ObjBlockFormatInfoBoxdemo"];
	
	  thisEditor = document.body.all["demo"];
      thisForm=thisEditor;
	  while(thisForm.tagName!="FORM"&&thisForm.tagName!="HTML") {
		thisForm=thisForm.parentElement; 
	  }
	  if(thisForm.tagName!="FORM") {	
		alert("Error: The editor must be contained in a form.");
	  }
	 
	  if (typeof(ObjEditordemo) == "undefined") {
	    alert("Error: There must be one element on the page with an ID of ObjEditordemo");
	  }
	
	  if (ObjEditordemo.className != "tbContentElementdemo") {
	    alert('Error: tbContentElementdemo must have its class set to "tbContentElementdemo"');
	  }
      
	  // Add an onmouseover handler to the tbContentElement. We need this for when the DHTML Edting
	  // control is the content element. IE doesn't give the toolbars onmouseout events in that case. 
	  document.write('<SCRIPT LANGUAGE="JavaScript" FOR="tbContentElementdemo" EVENT="onmouseover"> TBContentElementMouseOver(); </scrip' +'t>');
	
	  //bind onSubmit event to saveIt()
	  
	  thisForm.onsubmit = saveItdemo;
	  
	  statusAreademo.innerText = "Design Mode";
	  
  
}
</script>


</script>
  
 </form>
 
</body>
</html>